<template lang="pug">
  div.topbar-toolbar
    ul.hidden-md-down.notification-list.no-margin.hidden-sm-down.no-style
      //- v-if="hasTaskNotice"
      //- li.inline.task-box()
      //-   a(href="#" @click="toggleTask")
      //-     i.iconfont.icon-bell
      //-   TaskList.task-list.dropdown-menu.dropdown-menu-right.profile-dropdown(
      //-     :class="{'d-block':showTask}"
      //-     :taskData="taskData"
      //-     :taskDoneData="taskDoneData"
      //-     :taskRelation="taskRelation")
      li.inline
        Screenfull.screenfullBox(:size="20")
      li.inline
        qrcode(v-if="eqCode")
</template>

<script>
import Screenfull from './Screenfull'
import TaskList from './TaskList'
import { checkActions } from '@/utils/auth'
// import Clickoutside from '@/utils/clickoutside'

import qrcode from './qrcode'
const hasTaskNotice = checkActions('/system/#/workFlow/TaskNotice')
export default {
  name: 'Toolbar',
  // directives: { Clickoutside },
  components: {
    Screenfull,
    TaskList,
    qrcode
  },
  data () {
    return {
      // eqCode: this.$config.code,
      eqCode: 1,
      showTask: false,
      hasTaskNotice: hasTaskNotice, // 消息通知权限
      currentActive: -1,
      taskRelation: {},
      taskData: [], // 待办
      taskDoneData: [] // 已办
    }
  },
  created () {
    // if (!this.hasTaskNotice) return
    // this.getTaskList()
    // this.getTaskDoneList()
  },
  methods: {
    toggleTask (index) {
      this.showTask = !this.showTask
      this.currentActive = index
    },
    getTaskList (data) {
      this.$get({
        url: '/workflow/doingList'
      }).then(data => {
        if (data) {
          this.taskData = data.data.slice(0, 4)
          // 轮询
          setTimeout(() => {
            this.getTaskList()
          }, 50000)
        }
      })
    },
    getTaskDoneList (data) {
      this.$get({
        url: '/workflow/doneList'
      }).then(data => {
        if (data) {
          this.taskDoneData = data.data.slice(0, 4)
          // 轮询
          setTimeout(() => {
            this.getTaskDoneList()
          }, 50000)
        }
      })
    }
    // getRelation () {
    //   /* relation TODO 字段? */
    //   this.$getRelation({
    //     relations: 'flowDefines'
    //   }).then(relation => {
    //     this.taskRelation = relation
    //     console.log('123relation', relation)
    //   })
    // }
  }
}
</script>

<style lang="sass" scoped>
.task-list
  z-index: 2030!important
.task-list:after
  right: 10px
.topbar-toolbar
  display: none
  line-height: 36px
  ul
    padding: 0 20px
    li
      padding: 10px 5px
      a
        .iconfont
          font-size: 20px
.task-box
  position: relative
.isAct
  background: #e6f7ff
</style>
